<template>
    <div class="stuHome">
        <!-- 标题栏 -->
        <cjcNav title="建言献策(学生)" custom='true' @customRouter="customRouter">
            <div class="refresh" @click="refresh">
                <Icon type="android-refresh" size="25" color="#0093dd" style="margin-right:15px;"></Icon>
            </div>
        </cjcNav>
        <!-- 内容 -->
        <div class="stufy-nodata" v-if="isNull">
            <img class="nodataImg" src="static/student/nodata.png">
            <div class="nodataCon">暂无数据</div>
            <div class="fbButton" @click="toFB">
                <Icon type="plus" size="25" color="#ffffff"></Icon>
                <div class="fbtxt">发布</div>
            </div>
        </div>
        <!-- <div class="stufy-nodata" v-if="isNull">
            <img class="nodataImg" src="static/student/nodata.png">
            <div class="nodataCon">暂无数据</div>
        </div> -->
        <div class="stufy-home" v-else>
            <div v-for="item in this.$store.state.student.stuEventList" :key="item.EVENT_ID">
                <div class="line-pad"></div>
                <conditionCard :info="item"  @click.native="toLink('stuDetail', item.EVENT_ID)"/>
            </div>
            <div class="fbButton" @click="toFB">
                <Icon type="plus" size="25" color="#ffffff"></Icon>
                <div class="fbtxt">发布</div>
            </div>
        </div>
        <Spin size="large" fix v-if="landing"></Spin>
    </div>
</template>

<script>
// import Vue from 'vue'
// import vueScrollBehavior from 'vue-scroll-behavior'
export default {
    name: 'stuHome',
    data() {
        return {
            isNull: false,
            landing: false,
        }
    },
    components: {
        cjcNav: () => import('@/components/common/Nav.vue'),
        conditionCard: () => import('@/components/student/conditionCard'),
    },
    methods: {
        customRouter() {
            this.$cjc.closeWebView()
        },
        toFB() {
            this.$router.push({
                path: 'stuPublish'
            })
        },
        refresh() {
            this.setEventList()
            this.$Message.info({
                content: '刷新中…',
                duration: 1.5
            })
        },
        toLink(link, EVENT_ID) {
            // sessionStorage.setItem('page', 'complate')
            sessionStorage.setItem('stuEventId', EVENT_ID)
            this.$router.push({
                name: link
            })
        },
        /**
         * 获取列表
         * @userId
         */
        // console.log(State.userInfo.USER_ID)
        async setEventList() {
            let EventList = await this.$store.dispatch('getEventByUserId', {
                userId: this.$store.state.userInfo.USER_ID,
            })
            console.log(EventList)
            this.landing = false
            if (EventList.status === 0) {
                this.$store.commit('SET_getEventListById', EventList.result)
            } else if (EventList.status === 1) {
                this.$store.commit('SET_getEventListById', EventList.result)
                this.isNull = true
            } else {
                this.$store.commit('SET_getEventListById', 'noData')
                this.$Message.error(EventList.msg)
                this.isNull = true
            }
        }
    },
    created() {
        const Vm = this
        const State = this.$store.state
        Vm.landing = true
        /**
         * 确认用户信息是否加载
         */
        function isUserInfo() {
            return new Promise((resolve, reject) => {
                let isu = setInterval(() => {
                    if (State.userInfo) {
                        clearInterval(isu)
                        resolve()
                    }
                }, 100)
            })
        }
        // 执行步骤
        async function Step() {
            Vm.setEventList()
        }
        isUserInfo().then(() => {
            Step()
        })
    }
}
</script>

<style lang="less">
.stuHome{
    // height: 100%;
    .line-pad{
        background-color: #f8f8f8;
        width: 100%;
        height: 20px;
    }
    .nav .title{
        font-size: 15px;
        letter-spacing: 0;
    }
}
.refresh {
    height: 50px;
    width: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.stufy-home {
  height: 100%;
  width: 100%;
  margin-bottom: 100px;
}
.stufy-nodata {
  margin: 100px 0 0;
  height: 100%;
  width: 100%;
  display: flex;
  justify-content: center;
  flex-direction: column;
  align-items: center;
}
.nodataImg {
  height: 120px;
}
.nodataCon {
  margin-top: 10px;
  font-size: 16px;
  color: #999999; 
}

.fbButton {
  height: 60px;
  width: 60px;
  background-color: #0093dd;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  position: fixed;
  bottom: 20px;
  right: 20px;
}
.fbtxt {
  color: #ffffff;
}

</style>
